<template>
	<view >
		<view v-if="list.length===0" style="color: #CCCCCC;text-align: center;width: 100%;height: 500upx;line-height: 500upx;font-size: 32upx;"> 暂无成员 </view>

		<view v-else v-for="(item,index) in list" :key="index">
				<view class="un-team" @click="kaiguan(index,item)">
					<view>
						<image v-if="item.AVATOR" class="portrait" :src='img+item.AVATOR' mode="aspectFill"></image>
						<image v-else class="portrait" src='/static/missing-face.png'></image>
					</view>
					<view class="un-team-text1">
						<text>{{item.NAME}}</text>
					</view>
					<view class="un-team-text2">
						<text>{{item.LEVEL}}</text>
					</view>
					<view class="un-team-text3">
						<text>{{item.INVITE.length}}</text>
					</view>
					<view class="un-team-text4" >
						<text class="iconfont "  :class="(selectedIndex==(index+1))?'icon-shang2':'icon-shang1'"> </text>
					</view>
				</view>
				
				<view v-for="(item1,index1) in list[index].INVITE" :key="index1" class="un-team1" v-if="selectedIndex==(index+1)">
					<view class="un-team1-image">
						<image v-if="item1.AVATOR" class="portrait" :src='img+item1.AVATOR' mode="aspectFill"></image>
						<image v-else class="portrait" src='/static/missing-face.png'></image>
					</view>
					<view class="un-team-text1">
						<text>{{item1.NAME}}</text>
					</view>
					<view class="un-team-text2">
						<text>{{item1.LEVEL}}</text>
					</view>
				</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// list:[
				// 	{tou:'',name:'河北',taici:'会员',memeber:[],kai:false},
				// 	{tou:'',name:'河南',taici:'一级代理',memeber:[
				// 		{tou:'',name:'郑州',taici:'一级代理'},
				// 		{tou:'',name:'开封',taici:'会员'},
				// 		{tou:'',name:'洛阳',taici:'会员'},
				// 		{tou:'',name:'平顶山',taici:'会员'},
				// 	],kai:false},
				// 	{tou:'',name:'山东',taici:'黄金',memeber:[
				// 		{tou:'',name:'山东大学',taici:'一级代理'},
				// 		{tou:'',name:'山东农业大学',taici:'一级代理'},
				// 		{tou:'',name:'山东现代工业大学',taici:'一级代理'},
				// 		{tou:'',name:'山东大学',taici:'一级代理'},
				// 	],kai:false},
				// 	{tou:'',name:'山个大幅度发西',taici:'普通用户',memeber:[],kai:false},
				// 	{tou:'',name:'陕西',taici:'经纪人',memeber:[],kai:false},
				// ],
				list:[],
				selectedIndex: 0,
				img:'',
			}
		},
		onLoad(){
			this.img = getApp().globalData.imageAddress;
			this.loadData()
			uni.startPullDownRefresh();
		},
		onPullDownRefresh() {
			console.log('refresh');
			setTimeout(function () {
				uni.stopPullDownRefresh();
			}, 1000);
		},
		// computed: {
		// 	  myObj: {
		// 		get: function(){
		// 			return this.list; // 在这里把临时对象的值通过计算属性赋值给页面中用到的对象
		// 		}
		// 	},
		// },
			
		methods: {
			kaiguan(index,item){
				if(!item.kai){
					this.selectedIndex = index+1
				}else{
					this.selectedIndex = 0
				}
				item.kai=!item.kai;
			},
			async loadData(){
				this.$http.post("/user/team",{
					SIGNATURE : uni.getStorageSync("SIGNATURE"),
					TOKEN: uni.getStorageSync('userInfo').TOKEN,
				}).then((res) => {
					
					if (res.statusCode === 200 && res.data.STATE === '0') {  
						this.list = res.data.OBJECT
						this.list = this.list.map(item=>{
							item.kai = false
							return item
						})
						console.log("res",this.list);
						
					}else{
						uni.showToast({title:res.data.MSG, icon:"none"});
					}
				}).catch((err)=>{
					console.log('request fail', err);
				})
			}
		}
	}
</script>

<style lang="scss">
	.un-team{
		display: flex;
		padding: 0upx 40upx;
		align-items: center;
		font-size: 30upx;
		font-weight: 600;
		font-family: 'Arial Normal', 'Arial','微软雅黑';
		height: 120upx;
		border-bottom: 1upx solid $border-color-base;
	}
	.un-team1{
		display: flex;
		background-color: #f8f2e2;
		padding: 0upx 70upx;
		align-items: center;
		font-size: 30upx;
		font-weight: 900;
		height: 120upx;
	}
	.portrait{
		width: 90upx;
		height: 90upx;
		border:5upx solid #fff;
		border-radius: 50%;
	}
	.un-team-text1{
		width: 300upx;
		text-align: center;
		margin-left: 20upx;
	}
	.un-team-text2{
		width: 200upx;
		text-align: center;
		margin-left: 20upx;
	}
	.un-team-text3{
		width: 50upx;
		text-align: center;
		background-color: #f5d5b0;
		margin-left: 20upx;
	}
	.un-team-text4{
		width: 50upx;
		text-align: center;
		margin-left: 20upx;
		text{
			font-size: 28upx;
			font-weight: 900;
		}
	}
	
</style>
